<?xml version="1.0" encoding="windows-1252"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <script type="text/javascript" src="js/jquery.js"/>
        <script type="text/javascript" src="js/jquery.dataTables.min.js"/>
        <link href="css/jqtest.css" rel="stylesheet" type="text/css" />
        <link href="css/demo_table.css" rel="stylesheet" type="text/css" />
        <link href="css/demo_page.css" rel="stylesheet" type="text/css" />
        <link href="css/demo_table_jui.css" rel="stylesheet" type="text/css" />
        <link href="css/jquery-ui-1.7.3.custom.css" rel="stylesheet" type="text/css" />
        <title>my j query playground</title>
        <script type="text/javascript">
            $(document).ready(function() {
                $(".button").click(function() {
                    var row = "<tr><td>Hello</td><td>hello</td><td>hi</td><td>+</td></tr>";
                    $("#peeps > tbody:first").append(row);
                });
                oTable = $('#peeps').dataTable({
                    "bJQueryUI": true,
                    "sPaginationType": "full_numbers"
        	});

            })

        </script>
    </head>
    <body>
        <div id="pagewrapper">
            <h2>jQuery Playground!</h2>
            <p>
                This is my jquery playground. This example just tries to add a new row anytime you click the + sign. But it still fucks up!
            </p>
            <table id="peeps" >
                <thead>
                    <tr>
                        <th>Name</th>
                        <th>Email</th>
                        <th>Phone</th>
                        <th />
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>John</td>
                        <td>smith@email.com</td>
                        <td>349-781-9298</td>
                        <td><a class="button" href="#">+</a></td>
                    </tr>
                    <tr>
                        <td>Emilie</td>
                        <td>lolly@email.com</td>
                        <td>349-781-9298</td>
                        <td><a class="button" href="#">+</a></td>
                    </tr>
                    <tr>
                        <td>Lillian</td>
                        <td>boo@email.com</td>
                        <td>349-781-9298</td>
                        <td><a class="button" href="#">+</a></td>
                    </tr>
                </tbody>
            </table>
        </div>
    </body>
</html>
